<template>
	<div>
    <Form>
        <FormItem label="选择地区">
          <Cascader style="width: 500px;display:inline-block" :data="regionArray" v-model="regionModel" @on-change="regionSelector" :load-data="loadRegion"></Cascader>
        </FormItem>
        <FormItem label="村(社区)组" required>
					<Input class="view-input" v-model="dataForm.villageGroupName" placeholder="请输入组名称"></Input>
				</FormItem>
      </Form>
    <Button type="primary" @click="Submit">提交</Button>
  </div>
</template>

<script scope>
export default {
  props: {
    dataBus: Object,
    callbank: Function
  },
  data () {
    return {
      regionModel: [],
      regionArray: [],
      dataForm: {
        orgId: this.$store.getOrg('orgId')
      }
    }
  },
  methods: {
    Init() {
      this.regionInit()
      this.$nextTick(() => {
        this.dataForm.villageGroupId = this.dataBus.villageGroupId
        this.dataForm.villageGroupName = this.dataBus.villageGroupName
        if(this.dataBus.regionPath) {
          this.regionModel = this.dataBus.regionPath.split(',')
        }
      })
    },
    Submit(){
      new this.$rest({
        gateway: 'agrobiz',
        service: "agrobiz-uc",
        url: "/v1.0/village/group",
        data: {
          pojo: this.dataForm
        },
        action: (res) => {
          if (res.data.code === 20000) {
            this.$Message.success({
              content: '编辑成功',
              duration: 1,
              onClose: ()=> {
                this.callbank()
              }
            })
          } else {
            this.$Notice.warning({
              desc: `失败原因：${res.data.msg}`,
            });
          }
        },
      }).put()
    },
    regionInit() {
      new this.$rest({
				gateway: 'agrobiz',
        service: "agrobiz-uc",
        url: "/v1.0/plus/union/region/lazy",
				query: {
					equal: {
            regionId: "0"
          }
				},
				action: (res)=>{
					if(res.data.code === 20000){
						const data = res.data.data
						this.regionArray = data
					} else {
						this.$Message.error({
              content: res.data.msg
            })
					}
				}
			}).get()
    },
		loadRegion(item, callback) {
			item.loading = true
			new this.$rest({
				gateway: 'agrobiz',
        service: "agrobiz-uc",
        url: "/v1.0/plus/union/region/lazy",
				query: {
					equal: {
            regionId: item.id,
            regionLevel: 5
          }
				},
				action: (res)=>{
					if(res.data.code === 20000){
						const data = res.data.data
						item.children = data
						item.loading = false
            callback()
					} else {
						this.$Message.error({
              content: res.data.msg
            })
					}
				}
			}).get()
		},
    regionSelector(value, data) {
      this.dataForm.regionCode = data[4].value
      this.dataForm.regionName = data[4].label
		},
  }
}
</script>
<style lang="less" scoped>
.layer_top {
  display: flex; flex-wrap: wrap;
}
.name-area {
  padding: 3px 0; width: 33%;
}
.names {
  width: 100px; font-weight: 800; display: inline-block;
}
.imgs {
  width: 100px;
}
.yings {
  vertical-align: top;
}
</style>